<!-- 区域节点 -->

<template>
  <div class="PatrolMap-AreaNode">
    <span :class="nodeClass">{{ data.name }}</span>

    <img v-if="hasAlarm" :src="areaImg" />
  </div>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'
import AreaNode from '@admin/views/Secure/Patrol/PatrolMap/AreaNode'

const { name, props } = AreaNode

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name,

  /**
   * 混入列表 (配置选项合并)
   */
  mixins: [CORE.mixInfo()],

  /**
   * 属性注册 (抽取以便查阅)
   */
  props,

  /**
   * 计算属性 (慎用箭头函数)
   */
  computed: {
    /**
     * 区域的提示图片
     */
    areaImg: AreaNode.computed.areaImg,

    /**
     * 有无告警
     */
    hasAlarm() {
      const { info: { areaIdList }, data } = this
      return areaIdList.some((id) => data.id === id)
    },
  },
}
</script>
